<?php require VIEWPATH . ADMIN_DIR . DIRECTORY_SEPARATOR . 'header.php' ?>
<style type="text/css">
    .reselect {
        font-size: 12px;
        border-radius: 10px;
        vertical-align: bottom;
        padding: 2px 12px;
        margin-top: 10px;
    }
    #custom-menu-form img {
        max-height: 300px;
    }
</style>
<div class="page-header">
    <h1>
        <?= isset($customMenu['id']) && $customMenu['id'] ? '修改' : '添加' ?>外链
    </h1>
</div>
<div class="col-xs-12">
    <form id="custom-menu-form" class="form-horizontal">
        <input type="hidden" name="id" value="<?= isset($customMenu['id']) ? $customMenu['id'] : '' ?>" />
        <!-- 图片提交输入框 -->
        <input type="hidden" name="img" value='<?= isset($customMenu['icon']) ? $customMenu['icon'] : '' ?>' />
        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right">外链名称：</label>
            <div class="col-sm-6">
                <input class="form-control" type="text" name="title" value="<?= isset($customMenu['title']) ? $customMenu['title'] : '' ?>" placeholder="请填写外链名称" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right">外链链接：</label>
            <div class="col-sm-6">
                <input class="form-control" type="text" name="link" value="<?= isset($customMenu['link']) ? $customMenu['link'] : '' ?>" placeholder="请填写外链连接" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right">显示位置：</label>
            <div class="col-sm-6">
                <select class="chosen-select form-control tag-input-style" id="postion-select" data-placeholder="选择显示位置" name="position" multiple="multiple">
                    <option value="<?= CUSTOM_MENU_POSITION_BRAND ?>" <?= isset($customMenu['positionArr']) && in_array(CUSTOM_MENU_POSITION_BRAND, $customMenu['positionArr'])  ? 'selected' : '' ?>>电子班牌</option>
                    <option value="<?= CUSTOM_MENU_POSITION_STUDENT ?>" <?= isset($customMenu['positionArr']) && in_array(CUSTOM_MENU_POSITION_STUDENT, $customMenu['positionArr']) ? 'selected' : '' ?>>学生移动端</option>
                    <option value="<?= CUSTOM_MENU_POSITION_TEACHER ?>" <?= isset($customMenu['positionArr']) && in_array(CUSTOM_MENU_POSITION_TEACHER, $customMenu['positionArr']) ? 'selected' : '' ?>>教师移动端</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right">显示方式：</label>
            <div class="col-sm-6">
                <select class="form-control" name="mode">
                    <option value="<?= CUSTOM_MENU_MODE_WEB ?>" <?= isset($customMenu['mode']) && $customMenu['mode'] == CUSTOM_MENU_MODE_WEB ? 'selected' : '' ?>>电脑端网页形式</option>
                    <option value="<?= CUSTOM_MENU_MODE_MOB ?>" <?= isset($customMenu['mode']) && $customMenu['mode'] == CUSTOM_MENU_MODE_MOB ? 'selected' : '' ?>>手机端网页形式</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label no-padding-right">外链图标：<br>建议尺寸（144*144）</label>
            <div class="col-sm-6 upload-div">
                <?php if (isset($customMenu['icon']) && $customMenu['icon']) : ?>
                    <div href="javascript:;" id="upload-img">
                        <img src="<?= $customMenu['icon'] ?>" />
                    </div>
                    <div id="reselect-img" class="btn btn-info reselect">重新选择</div>
                <?php else : ?>
                    <div href="javascript:;" id="upload-img">
                        <img src="<?= $staticAdminUrl ?>assets/images/upload.png" />
                    </div>
                    <div id="reselect-img" class="btn btn-info reselect" style="visibility:hidden;">重新选择</div>
                <?php endif; ?>
            </div>
        </div>
        <div class="clearfix">
            <div class="col-md-offset-3 col-md-9">
                <button class="btn btn-info" type="submit">
                    <i class="ace-icon fa fa-check"></i> 提交
                </button>
            </div>
        </div>
    </form>
</div>
<?php require VIEWPATH . ADMIN_DIR . DIRECTORY_SEPARATOR . 'footer.php' ?>
<script type="text/javascript">
    $(function() {
        // 教学班下拉选择
		$("#postion-select").chosen({
			search_contains: true
		}); 
        var upFromurl = '<?= UP_FORM_URL ?>';
        var signature = '<?= $signature ?>';
        var policy = '<?= $policy ?>';
        // 上传图片
        $("#upload-img").uploader({
            "server": upFromurl,
            "authorization": signature,
            "policy": policy,
            "callback": function(response) {
                var fileName = decodeURIComponent(response.name);
                var fileLink = upyunUrl + response.url;
                $("#upload-img").find("img").attr("src", fileLink);
                $("[name=img]").val(fileLink);
                // 显示重新选择按钮
                reselectCover = $('#reselect-img');
                if (reselectCover) {
                    reselectCover.show();
                    reselectCover.css('visibility', 'visible');
                }
            }
        });
        // 重新选择
        $("#reselect-img").uploader({
            "server": upFromurl,
            "authorization": signature,
            "policy": policy,
            "callback": function(response) {
                var fileName = decodeURIComponent(response.name);
                var fileLink = upyunUrl + response.url;
                $("#upload-img").find("img").attr("src", fileLink);
                $("[name=img]").val(fileLink);
            }
        });
        // 提交表单
        var form = $("#custom-menu-form");
        var submitUrl = "<?= admin_url('brand/save_custom_menu_action') ?>";
        form_submit(form, submitUrl, function(res) {
            tips_alert(res.msg, res.success, function() {
                if (res.success) {
                    window.location.href = "<?= admin_url('brand/custom_menu') ?>";
                }
            });
        })
    })
</script>